fix: 修复表单重置后，页面变化了，表单内部的状态未能及时同步

General

✏️ Mark the necessary items without changing the structure of the PR template.

• Pull request template structure not broken

Type

ℹ️ What types of changes does your code introduce?

👉 Put an x in the boxes that apply

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• This change requires a documentation update

Checklist

ℹ️ Check all checkboxes - this will indicate that you have done everything in accordance with the rules in CONTRIBUTING.

👉 Put an x in the boxes that apply.

• My code follows the style guidelines of this project
• Is the code format correct
• Is the git submission information standard?
• My code follows the style guidelines of this project
• I have performed a self-review of my own code
• I have commented my code, particularly in hard-to-understand areas
• I have made corresponding changes to the documentation
• My changes generate no new warnings
• I have added tests that prove my fix is effective or that my feature works
• New and existing unit tests pass locally with my changes
• Any dependent changes have been merged and published in downstream modules

场景描述

在使用 useTable 时，需要手动重置 form 表单，然后发送异步请求。

问题描述

useTable 调用后解构出来的 getForm 调用 resetFields 未能即时同步页面变化到 form 表单内部的状态，就是说——页面发生变化后，resetFields 是异步重置表单的。

使用案列

<template>
  <BasicTable @register="registerTable">
    <template #toolbar>
      <a-button type="primary" @click="handleReset"> 重置表单 </a-button>
    </template>
  </BasicTable>
</template>

<script lang="ts" setup>
import { BasicTable, useTable } from '@/components/Table';

const options = { /* ... */ };
const [registerTable, { reload, getForm }] = useTable(options);

async function handleReset() {
  const form = getForm();
  await form.resetFields();
  const data = form.getFieldsValue();
  const unitId: number = props.unitId;
  const searchInfo = { ...data, unitId };
  reload({ page: 1, searchInfo });
}
</script>

修复前

• 修复前的 src/components/Form/src/hooks/useForm.ts
  

• 调用修复前的 resetFields
  

• showcase: 调用修复前的 resetFields
  

修复后

• 修复后的 src/components/Form/src/hooks/useForm.ts
  

• 调用修复后的 resetFields
  

• showcase: 调用修复后的 resetFields